<div align="center" style="margin-top:100px">
<form id="frmLogin" name="frmLogin" action="<?php echo site_url(array('login', 'ajax', 'check'))?>" method="post">
<table cellpadding="5" class="zebraable" width="400px">
<tr>
	<td colspan="2" bgcolor="#5872a7"><h2 style="padding: 0; margin: 0; color: #FFF;">Login</h2></td>
</tr>
<tr>
	<td colspan="2"><span id="message" style="color:red; padding: 4px; display: none;"></span></td>
</tr>
<tr>
	<td align="center">
	<table cellpadding="8px">
		<tr>
			<td>Username : </td>
			<td><input type="text" value="" name="username" class="validate['required']" /></td>
		</tr>
		<tr>
			<td>Password : </td>
			<td><input type="password" value="" name="password" class="validate['required']" /></td>
		</tr>
		<tr align="right">
			<td colspan="2">
				<input type="reset" class="button" value="Reset" />
				<input type="submit" class="button" value="Log In" />
			</td>
		</tr>
	</table>
	</td>
</tr>
<tr>
	<td></td>
</tr>
</table>
</form>
<script type="text/javascript">
window.addEvent('domready', function(){
    new FormCheck('frmLogin',{submitByAjax:true, 
        onAjaxSuccess: function(res){
	    	var json = JSON.decode(res);
			if (json.error){
				$('message').set('html',json.msg).show();
			}
			else{
				document.location=json.url;
			}
        }
    });
});
</script>
</div>